<template>
  <Card title="房源申报动态" :loading="isLoading" class="wyf-card scroll-content">
    <TableScroll :tableColumns="propertyDeclarationColumns" :info="tableData2" v-if="tableData2.length > 0">
      <!-- <template #xm="{ data }">
        <span><img src="../../../assets/images/screen/yrds.png" alt="" width="20px" style="vertical-align: -4px" />{{ data }}</span>
      </template>
      <template #sj="{ data }">
        <span style="color: #fff">{{ data }}起</span>
      </template> -->
    </TableScroll>
    <a-empty v-else style="padding-top: 50px" />
  </Card>
</template>
<script lang="ts" setup>
  import { Ref, ref, watch, inject } from 'vue';
  import { Card } from 'ant-design-vue';
  import TableScroll from './TableScroll.vue';
  import { propertyDeclarationColumns } from '../data';
  import { getHousesList } from '../api';

  const props = defineProps({
    loading: {
      type: Boolean,
      default: false,
    },
  });
  const tjfw: any = inject('tjfw');
  console.log(tjfw, 2222222222);
  const isLoading = ref(false);
  //一人多事
  const tableData2 = ref([]);

  watch(
    () => tjfw.value,
    () => {
      // if (props.loading) {
      //   return;
      // }
      // TODO
      //  initChart();
      getData();
    },
    { immediate: true }
  );
  function getData() {
    isLoading.value = true;
    getHousesList({ count: 20, tjfw: tjfw.value }).then((res) => {
      if (res.code == 200 && res.result) {
        tableData2.value = res.result;
      }
      isLoading.value = false;
    });
  }
</script>
<style scoped lang="less">
  .wyf-card {
    height: 386px;
    :deep(.ant-card-head) {
      border: none;
    }
    :deep(.ant-card-body) {
      height: calc(100% - 56px);
      padding-top: 0;
    }
  }
</style>
